<%@ page language="java" import="java.util.*,com.sirenbang.easyshop.config.*" pageEncoding="utf-8"%>
<%@ include  file="/jsps/front/common/taglibs.jsp" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>

    <title>注册新用户- </title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	
	<link rel="stylesheet" type="text/css" href="<c:url value="/jsps/front/css/register.css"/>">
    <script type="text/javascript">
        function $(id){
        	return document.getElementById(id);
        };
        function $F(id){
	        var o=$(id);
	        return o.value;
        };
        
        var msg=new Array();
		msg[0]="此邮箱将是您将用来接收验证邮件。";
		msg[1]="此项为必填项，请输入您的Email地址。";
		msg[2]="Email格式错误，请重新填写。";
		msg[3]="此<span class=\"f_Arial\">用户昵称</span>已被注册，请重新填写。";
		msg[4]="此项为必填项，请输入您的昵称。";
		msg[5]="格式错误，请用大小写英文字母、中文、数字,长度2-10个汉字或3-20个字符。";
		msg[6]="此昵称已有人使用，请重新填写。";
		msg[7]="密码可由大小写英文字母、数字组成，长度6－20个字符。";
		msg[8]="此项为必填项，请设置您的密码。";
		msg[9]="密码格式错误，请用大小写英文字母、数字，长度6－20个字符。";
		msg[10]="此项为必填项，请再次输入您的密码。";
		msg[11]="两次密码输入不一致，请重新填写。";
		msg[12]="请输入图片中的四个字母。";
		msg[13]="此项必填。";
		msg[14]="验证码输入错误，请重新填写。";
		msg[15]="昵称可由大小写英文字母、中文、数字组成，长度2-10个汉字或4-20个字符。";
		msg[16]="不区别大小写";
		msg[17]="验证码过期，请重新填写。";
		
	   /** 获得填写邮箱地址的焦点*/
		function check_email_focus(){
		    $('email_ok').style.display="none";
		    $('emailValidMsg').className="notice_1";
		    $('emailValidMsg').style.display="inline";
		    $('emailValidMsg').innerHTML=msg[0];
		
		}
		/*验证填写邮箱地址*/
		function txtEmail_check(){
		    var email=$F('custEmail');
		    var a=$('emailValidMsg');
		    var b=$('custEmail');
		    /*判断是否为空*/
		    if(email==''){
		    	a.className='notice_error';
		    	a.innerText=msg[1];
		    	b.className='input_text_error';
		    	return false;
		    }
		    /*alert(email.indexOf('.'));*/
		    
		    /*判断邮箱的有效性*/
		    if(email.length>30 || email.indexOf('@')==-1 ||email.indexOf('.')==-1 ||email.indexOf('.')+1==email.length ||email.indexOf('.')<=email.indexOf('@')+1){
		      	a.className='notice_error';
		    	a.innerText=msg[2];
		    	b.className='input_text_error';
		    	return false;
		    }
		    /*验证通过后成功标志*/
		    a.style.display="none";
		    $('email_ok').style.display="inline";
		    return true;
		}
		/*设置真实名称*/
		function check_reallyName_focus(){
			$('reallyname_ok').style.display="none";
		    $('reallyNameValidMsg').className="notice_1";
		    $('reallyNameValidMsg').style.display="inline";
		    $('reallyNameValidMsg').innerHTML="请输入正确的名称";
		}
        
        function txtReallyName_check(){
		    var reallyName = $F('reallyName');
		    $('reallyNameValidMsg').style.display="inline";
		    $('reallyName_ok').style.display="none";
            /*alert(nickname.charCodeAt(0));*/
            var length=reallyName.length;
		    if(reallyName=='')
		    {
		        $('reallyNameValidMsg').className="notice_error";
		        $('reallyNameValidMsg').innerHTML=msg[13];
		        $('txtReallyName').className="input_text_error";
		        
		        return false;
		    }
		    /*alert(isNaN(reaalyname)==false);*/
		    if(isNaN(reallyName)==false){
		        $('reallyNameValidMsg').className="notice_error";
		        $('reallyNameValidMsg').innerHTML="正确的姓名不能为数字";
		        $('txtReallyName').className="input_text_error";
		        
		        return false;
		    }
		    $('reallyNameValidMsg').style.display="none";    
		    $('reallyNameValidMsg').innerHTML='';
		    $('reallyname_ok').style.display="inline";
   
		    return true;
		}
		/*设置出生日期*/
		function check_born_focus(){
			$('born_ok').style.display="none";
		    $('bornValidMsg').className="notice_1";
		    $('bornValidMsg').style.display="inline";
		    $('bornValidMsg').innerHTML="出生日期格式为:yyyy-mm-dd";
		}
        
        function txtborn_check(){
		    var born = $F('born');
		    $('bornValidMsg').style.display="inline";
		    $('born_ok').style.display="none";
         
            var length=born.length;
		    if(born=="")
		    {
		        $('bornValidMsg').className="notice_error";
		        $('bornValidMsg').innerHTML=msg[13];
		        $('txtborn').className="input_text_error";
		        
		        return false;
		    }
		    if((2013-born.substring(0, 4))<10){
		        $('bornValidMsg').className="notice_error";
		        $('bornValidMsg').innerHTML="按此日期算出的年龄应大于等于10岁。";
		        $('txtborn').className="input_text_error";
		    }
		   
		    $('bornValidMsg').style.display="none";    
		    $('bornValidMsg').innerHTML='';
		    $('born_ok').style.display="inline";
   
		    return true;
		}
		/*设置电话号码*/
		function check_tel_focus(){
			$('tel_ok').style.display="none";
		    $('telValidMsg').className="notice_1";
		    $('telValidMsg').style.display="inline";
		    $('telValidMsg').innerHTML="此号码用于送货联系.";
		}
        
        function txttel_check(){
		    var tel = $F('tel');
		    $('telValidMsg').style.display="inline";
		    $('tel_ok').style.display="none";
         
            var length=tel.length;
		    if(tel=="")
		    {
		        $('telValidMsg').className="notice_error";
		        $('telValidMsg').innerHTML=msg[13];
		        $('txttel').className="input_text_error";
		        
		        return false;
		    }
		    if(isNaN(tel)!=false){
		        $('telValidMsg').className="notice_error";
		        $('telValidMsg').innerHTML="为数字";
		        $('txttel').className="input_text_error";
		        
		        return false;
		    }
		    $('telValidMsg').style.display="none";    
		    $('telValidMsg').innerHTML='';
		    $('tel_ok').style.display="inline";
   
		    return true;
		}
		/*设置邮编*/
		function check_pd_focus(){
			$('pd_ok').style.display="none";
		    $('pdValidMsg').className="notice_1";
		    $('pdValidMsg').style.display="inline";
		    $('pdValidMsg').innerHTML="邮编应为6位数";
		}
        
        function txtpd_check(){
		    var pd = $F('pd');
		    $('pdValidMsg').style.display="inline";
		    $('pd_ok').style.display="none";
            /*alert(nickname.charCodeAt(0));*/
            var length=pd.length;
		    if(pd=="")
		    {
		        $('pdValidMsg').className="notice_error";
		        $('pdValidMsg').innerHTML=msg[13];
		        $('txtpd').className="input_text_error";
		        
		        return false;
		    }
		    if(length!=6)
		    {
		        $('pdValidMsg').className="notice_error";
		        $('pdValidMsg').innerHTML="邮编为6位数";
		        $('txtpd').className="input_text_error";
		        
		        return false;
		    }
		    /*alert(isNaN(reaalyname)==false);*/
		    if(isNaN(pd)!=false){
		        $('pdValidMsg').className="notice_error";
		        $('pdValidMsg').innerHTML="邮编为数字";
		        $('txtpd').className="input_text_error";
		        
		        return false;
		    }
		    $('pdValidMsg').style.display="none";    
		    $('pdValidMsg').innerHTML='';
		    $('pd_ok').style.display="inline";
   
		    return true;
		}
		/*设置地址*/
		function check_address_focus(){
			$('address_ok').style.display="none";
		    $('addressValidMsg').className="notice_1";
		    $('addressValidMsg').style.display="inline";
		    $('addressValidMsg').innerHTML="请输入正确的地址";
		}
        
        function txtaddress_check(){
		    var address = $F('address');
		    $('addressValidMsg').style.display="inline";
		    $('address_ok').style.display="none";
            /*alert(nickname.charCodeAt(0));*/
            var length=address.length;
		    if(address=="")
		    {
		        $('addressValidMsg').className="notice_error";
		        $('addressValidMsg').innerHTML=msg[13];
		        $('txtaddress').className="input_text_error";
		        
		        return false;
		    }
		    if(length>=100)
		    {
		        $('addressValidMsg').className="notice_error";
		        $('addressValidMsg').innerHTML="地址字长不能超过100";
		        $('txtaddress').className="input_text_error";
		        
		        return false;
		    }
		    /*alert(isNaN(reaalyname)==false);*/
		    $('addressValidMsg').style.display="none";    
		    $('addressValidMsg').innerHTML='';
		    $('address_ok').style.display="inline";
   
		    return true;
		}
		/*设置昵称*/
		function check_nickname_focus(){
			$('nickname_ok').style.display="none";
		    $('nickNameValidMsg').className="notice_1";
		    $('nickNameValidMsg').style.display="inline";
		    $('nickNameValidMsg').innerHTML=msg[15];
		}
        
        function txtNickName_check(){
		    var nickname = $F('custName');
		    $('nickNameValidMsg').style.display="inline";
		    $('nickname_ok').style.display="none";
            /*alert(nickname.charCodeAt(0));*/
            var length=nickname.length;
            for(var i=0;i<length;i++){
            	if(nickname.charCodeAt(i)>127 || nickname.charCodeAt(i)==94){
            	    length+=1;
            	   /*alert(length);*/
            	}           	
            }
		    if(nickname=='')
		    {
		        $('nickNameValidMsg').className="notice_error";
		        $('nickNameValidMsg').innerHTML=msg[4];
		        $('txtNickName').className="input_text_error";
		        
		        return false;
		    }
		    /*alert(isNaN(nickname)==false);*/
		    if(length<3||length>20 ||isNaN(nickname)==false){
		        $('nickNameValidMsg').className="notice_error";
		        $('nickNameValidMsg').innerHTML=msg[5];
		        $('txtNickName').className="input_text_error";
		        
		        return false;
		    }
		    $('nickNameValidMsg').style.display="none";    
		    $('nickNameValidMsg').innerHTML='';
		    $('nickname_ok').style.display="inline";
   
		    return true;
		}
		
		function chAgree(){
		  var agree = $('agree');
		  if(agree.checked==false){
			$('btnClientRegister').style.display="inline";
			return false;
		}
		
		return true;
	}
		
		function check(){
		   if(txtEmail_check()==false||txtaddress_check()==false||txtpd_check()==false
		    ||txtReallyName_check()==false)
		      return false;
		   }
		   return true;
		}
 
    
    </script>
	

  </head>
  
  <body style="background-color: #769b72;">
	<FORM id=form name=form action="<c:url value="/securityMgr?act=update"/>" method=post>	
	<!-- 注册头部 -->	
		<DIV class=ddlogin_head_frame>
        	<DIV class=ddlogin_head>
        		<A href="" target=_blank>
        			<IMG title=logo src="<c:url value="/jsps/front/images/login/07.GIF"/>">
        		</A> 
				<P>
					<A href="#" target=_blank name=help>注册帮助</A>
				</P>
			 </DIV>
		</DIV>
		
		
	<!-- 注册内容区 begin -->
		<DIV class=login_frame style="align:center;">

	<DIV class=login_true style="align:center;">
					<UL class=login_ul>
						<LI>
							 <SPAN class=span_n>设置昵称：${loginedCustomer.userName}</SPAN>
						</LI>
						<LI>
							<SPAN class=span_n>
								<SPAN class=span_n>真实姓名：</SPAN>
							</SPAN>
							<INPUT class=input_text 
							       id=reallyName 
							       type="text" 
							       onblur="this.className='input_text';txtReallyName_check()"
								   onfocus="this.className='input_text input_text_over';check_reallyName_focus();"
							       maxLength=40 
							       name=reallyName
							       value="${loginedCustomer.realName}"> 
						    <P id=reallyNameValidMsg style="font-size:13px;"></P>
						    <IMG class=notice_ok id=reallyname_ok title=填写正确 src="<c:url value="/jsps/front/images/reg/write_ok.gif"/>"> 
						</LI>
						<LI>
						    <SPAN class=span_n>
								<SPAN class=span_n>邮编号码：</SPAN>
							</SPAN>
							<INPUT class=input_text 
							       id=pd 
							       type="text" 
							       onblur="this.className='input_text';txtpd_check()"
								   onfocus="this.className='input_text input_text_over';check_pd_focus();"
							       maxLength=40 
							       name=pd
							       value="${loginedCustomer.zipCode}"> 
						    <P id=pdValidMsg style="font-size:13px;"></P>
						    <IMG class=notice_ok id=pd_ok title=填写正确 src="<c:url value="/jsps/front/images/reg/write_ok.gif"/>"> 
						</LI>
						<li> 
			                <span class="span_n">性别：</span>
			                <input type="radio" name="usersex" value="1"
			                    <c:if test="${loginedCustomer.sex==1}">checked</c:if> >男
			                <input type="radio" name="usersex" value="0"
			                    <c:if test="${loginedCustomer.sex==0}">checked</c:if>>女         
			            </li>
						<LI>
							<SPAN class=span_n>
								<SPAN class=span_n>出生地址：</SPAN>
							</SPAN>
							<INPUT class=input_text 
							       id=address 
							       type="text" 
							       onblur="this.className='input_text';txtaddress_check()"
								   onfocus="this.className='input_text input_text_over';check_address_focus();"
							       maxLength=40 
							       name=address
							       value="${loginedCustomer.address}"> 
						    <P id=addressValidMsg style="font-size:13px;"></P>
						    <IMG class=notice_ok id=address_ok title=填写正确 src="<c:url value="/jsps/front/images/reg/write_ok.gif"/>"> 
						</LI>
						<LI>
							<SPAN class=span_n>
								<SPAN class=span_n>出生日期：</SPAN>
							</SPAN>
							<INPUT class=input_text 
							       id=born 
							       type="text" 
							       onblur="this.className='input_text';txtborn_check()"
								   onfocus="this.className='input_text input_text_over';check_born_focus();"
							       maxLength=40 
							       name=born
							       value="${loginedCustomer.userBirthday}"> 
						    <P id=bornValidMsg style="font-size:13px;"></P>
						    <IMG class=notice_ok id=born_ok title=填写正确 src="<c:url value="/jsps/front/images/reg/write_ok.gif"/>"> 
						</LI>
						<LI>
							<SPAN class=span_n>
								<SPAN class=span_n>电话号码：</SPAN>
							</SPAN>
							<INPUT class=input_text 
							       id=tel 
							       type="text" 
							       onblur="this.className='input_text';txttel_check()"
								   onfocus="this.className='input_text input_text_over';check_tel_focus();check_tel_focus();"
							       maxLength=40 
							       name=tel
							       value="${loginedCustomer.phoneCode}"> 
						    <P id=telValidMsg style="font-size:13px;"></P>
						    <IMG class=notice_ok id=tel_ok title=填写正确 src="<c:url value="/jsps/front/images/reg/write_ok.gif"/>"> 
						</LI>
						<LI>
							<SPAN class=span_n>
								<SPAN class=f_Arial>Email地址：</SPAN>
							</SPAN>
							<INPUT class=input_text 
							       id=custEmail 
							       type="text" 
							       onblur="this.className='input_text';txtEmail_check()"
								   onfocus="this.className='input_text input_text_over';check_email_focus()"
							       maxLength=40 
							       name=email
							       value="${loginedCustomer.email}"> 
						    <P id=emailValidMsg style="font-size:13px;"></P>
						    <IMG class=notice_ok id=email_ok title=填写正确 src="<c:url value="/jsps/front/images/reg/write_ok.gif"/>"> 
						</LI>
						
						
						
				        <!-- 验证码 -->
					</UL>
					<input type="submit" id=click_submit name=btn_register value="提 交 更 新 "					        onclick="if(check())document.forms[0].submit();"
					       style="width:80px;height:30px;font-size:12px;align:center;"/> 
					<input type="reset" value=" 重 置 "
					       style="width:60px;height:30px;font-size:12px;align:center;"/>
				</DIV>
			</DIV>
			<br>
			<c:if test="${not empty error}">
			   <script type="text/javascript">
				
				    $('nickNameValidMsg').style.display="inline";
				    $('nickname_ok').style.display="none";
		            /*alert(nickname.charCodeAt(0));*/
		           if('${errorr}'.indexOf("该用户以存在"))
				    {
				        $('nickNameValidMsg').className="notice_error";
				        $('nickNameValidMsg').innerHTML=msg[3];
				        $('txtNickName').className="input_text_error";
				    }

			   </script>
			</c:if>
		<!--注册内容区 end-->
		<!--预留页尾位置-->
		<DIV style="MARGIN: auto; WIDTH: 962px"></DIV>

	</FORM>					
  </body>
</html>
